<template>
	<view class="my-title" :style="{padding:padding}">
		<view class="leftCount" :style="{color:color}">
			<view :style="{fontSize:`${fontSize1}rpx`}">{{title1}}</view>
			<view class="title2">{{title2}}</view>
		</view>
		<view class="icon" v-if="isShow" @click="toMore">
			<text class="lookMore">{{rightCount}}</text>
			<uni-icons type="right" size="16" color="#A1A5AA"></uni-icons>
		</view>
	</view>
</template>

<script>
	export default {
		name:"my-title",
		data() {
			return {
				
			};
		},
		props:{
			title1:{
				type:String,
				default:''
			},
			title2:{
				type:String,
				default:''
			},
			isShow:{
				type:Boolean,
				default:false
			},
			rightCount:{
				type:String,
				default:'更多'
			},
			color:{
				type:String,
				default:'#000'
			},
			fontSize1:{
				type:String,
				default:'32'
			},
			padding:{
				type:String,
				default:'20rpx 0'
			},
		},
		methods:{
			toMore(){
				this.$emit('click')
			}
		}
	}
</script>

<style lang="scss">
.my-title{
	display: flex;
	justify-content: space-between;
	align-items: center;
	.leftCount{
		font-weight: 600;
		color: #16202B;
		.title2{
			font-weight: 400;
			font-size: 24rpx;
			color: #16202B;
			margin-top: 6rpx;
		}
	}
	.icon{
		display: flex;
		align-items: center;
		.lookMore{
			font-weight: 400;
			font-size: 28rpx;
			color: #A1A5AA;
		}
	}
}
</style>